// const Business = ()=>{
//     return(
//         <div>
//             管理
//         </div>
//     )
// }

// export default Business;
import React, { useState } from 'react';
import { Layout, Menu, Table, Input, Button, Space, Spin } from 'antd';
import { SearchOutlined } from '@ant-design/icons';
// import 'antd/dist/antd.css'; // 引入antd样式

const { Header, Content, Footer } = Layout;

// 假设我们有一个评价数据模型
const initialEvaluationData = [
  // 示例数据结构
  {
    id: '001',
    businessName: '业务A',
    content: '这是一个评价示例',
    createdAt: '2022-01-01',
  },
  // 更多评价...
];

const Business = () => {
  const [loading, setLoading] = useState(false);
  const [evaluations, setEvaluations] = useState(initialEvaluationData);
  const [searchText, setSearchText] = useState('');

  // 搜索评价的模拟函数
  const handleSearch = (value) => {
    setLoading(true);
    // 在这里进行搜索评价的API调用，然后更新evaluations状态
    setTimeout(() => {
      setLoading(false);
      // 模拟搜索结果（在真实场景下，会根据后端接口返回数据）
      setEvaluations(initialEvaluationData.filter((item) => item.businessName.includes(value)));
    }, 1000);
  };

  return (
    <Layout className="business-evaluation-manager">
      <Header>
        <div className="header-content">
          <Menu theme="dark" mode="horizontal">
            <Menu.Item key="1">业务评价管理</Menu.Item>
          </Menu>
          <Space>
            <Input.Search
              placeholder="搜索业务名称"
              enterButton={<SearchOutlined />}
              size="large"
              loading={loading}
              onSearch={handleSearch}
              value={searchText}
              onChange={(e) => setSearchText(e.target.value)}
            />
          </Space>
        </div>
      </Header>
      <Content>
        <Spin spinning={loading}>
          <Table
            dataSource={evaluations}
            rowKey="id"
            pagination={{ pageSize: 10 }}
            columns={[
              { title: '评价ID', dataIndex: 'id' },
              { title: '业务名称', dataIndex: 'businessName' },
              { title: '评价内容', dataIndex: 'content' },
              { title: '评价时间', dataIndex: 'createdAt' },
              // 其他列...
            ]}
          />
        </Spin>
      </Content>
      <Footer>
      <div style={{position:'absolute',left:'50%'}}>驾校管理系统&copy;2024-2099</div>
      </Footer>
    </Layout>
  );
};

export default Business;